var PW = PW || {};

PW.myCalendar = {

    options:function (options) {
        var _this = this;
        console.log('options:');
        console.log(options);

        this.opt = {};
        this.opt.venue = options.venue;
    },

    data:{},

    load:function () {
    },

    el:{ },

    events:function () {
        var _this = this;

        $(document).on('click', function () {
            $('[data-slot],[data-booking]').removeClass('open');
        });

        $(document).on('click', '[data-set-special]', function () {
            var _this = this;
            $('#specialModal').modal('show');

            $('#SpecialForm [name="form_slot"]').val($(_this).attr('data-set-special'));
            $('#SpecialForm [name="form_date"]').val($(_this).closest('[data-date]').attr('data-date'));
            $('#SpecialForm .current-price').html('£' + $(_this).attr('data-current'));
        });

        $(document).on('click', '#SpecialFormSubmit', function () {
            $('#SpecialForm').submit();
        });

        $(document).on('submit', '#SpecialForm', function () {
            var formData = $('#SpecialForm').serializeObject();

            var obj = {};
            obj.action = 'add_special';
            obj.form = formData;

            PW.ajax(obj,function(response){

                try {
                    PW.myCalendar.loadCalendar();
                } catch (e) { }

            });
            return false;
        });

        $(document).on('click', '[data-internal]', function () {
            var _this = this;
            $('#InternalModal').modal('show');

            $('#InternalModal [name="form_slot"]').val($(_this).closest('[data-slot]').attr('data-slot'));
            $('#InternalModal [name="form_date"]').val($(_this).closest('[data-date]').attr('data-date'));
            $('#InternalModal .current-price').html('£' + $(_this).attr('data-current'));
        });

        $(document).on('click', '#InternalFormSubmit', function () {
            $('#InternalForm').submit();
        });

        $(document).on('submit', '#InternalForm', function () {
            var formData = $('#InternalForm').serializeObject();

            var obj = {};
            obj.action = 'internal_booking';
            obj.form = formData;

            PW.ajax(obj,function(response){

                try {
                    PW.myCalendar.loadCalendar();
                } catch (e) { }

            });
            return false;
        });

        $(document).on('click', '[data-slot],[data-booking]', function () {
            var slot = $(this).attr('data-slot');

            $('[data-slot="'+ slot+'"]').find('.collapse').collapse('toggle');
            $('[data-slot],[data-booking]').removeClass('open');
            $('[data-slot]').css({'background':'white'});
            $('[data-slot="'+ slot+'"]').css({'background':'#eee'});
        });

        $(document).on('click', '[data-dropdown]', function () {
            var el = $(this).closest('.dropdown');
            $('[data-slot],[data-booking]').removeClass('open');
            $(this).closest('.dropdown').toggleClass('open');
            console.log(el)
            return false;
        });

        $('.load').on('click', function () {
            _this.loadCalendar();
        });

        $(document).on('click', '[data-activate]', function () {
            var obj = {
                'action':'activate_slot',
                'the_slot':$(this).attr('data-activate')
            };
            PW.ajax(obj, function () {
                _this.loadCalendar();
            });
        });

        $(document).on('click', '[data-deactivate]', function () {
            var obj = {
                'action':'deactivate_slot',
                'the_slot':$(this).attr('data-deactivate')
            };
            PW.ajax(obj, function () {
                _this.loadCalendar();
            });
        });

        $(document).on('click', '[data-remove]', function () {
            var obj = {
                'action':'remove_slot',
                'the_slot':$(this).attr('data-remove')
            };
            PW.ajax(obj, function () {
                _this.loadCalendar();
            });
        });

        $(document).on('click', '[data-remove-special]', function () {
            var obj = {
                'action':'remove_special',
                'the_special':$(this).attr('data-remove-special')
            };
            PW.ajax(obj, function () {
                _this.loadCalendar();
            });
        });

        $(document).on('click', '[data-cancel-booking]', function () {
            var obj = {
                'action':'cancel_booking',
                'the_booking':$(this).attr('data-cancel-booking')
            };
            PW.ajax(obj, function () {
                _this.loadCalendar();
            });
        });

        $(document).on('change', '#date-select', function () {
            _this.loadCalendar();
        });

        $(document).on('click', '[data-hide-inactive-slot]', function () {
            $('.container').addClass('hide-inactive-slot');
            $(this).removeAttr('data-hide-inactive-slot');
            $(this).attr('data-show-inactive-slot',"true");
            $(this).html('<div class="dot" style="background: #ddd;"></div> Show Inactive Slots');
        });

        $(document).on('click', '[data-show-inactive-slot]', function () {
            $('.container').removeClass('hide-inactive-slot');
            $(this).attr('data-hide-inactive-slot',"true");
            $(this).removeAttr('data-show-inactive-slot');
            $(this).html('<div class="dot" style="background: #ddd;"></div> Hide Inactive Slots');
        });

        $(document).on('click', '[data-hide-active-slot]', function () {
            $('.container').addClass('hide-active-slot');
            $(this).removeAttr('data-hide-active-slot');
            $(this).attr('data-show-active-slot',"true");
            $(this).html('<div class="dot" style="background: #3f7fff;"></div> Show Active Slots');
        });

        $(document).on('click', '[data-show-active-slot]', function () {
            $('.container').removeClass('hide-active-slot');
            $(this).attr('data-hide-active-slot',"true");
            $(this).removeAttr('data-show-active-slot');
            $(this).html('<div class="dot" style="background: #3f7fff;"></div> Hide Active Slots');
        });

        $(document).on('click', '[data-hide-booking]', function () {
            $('.container').addClass('hide-booking');
            $(this).removeAttr('data-hide-booking');
            $(this).attr('data-show-booking',"true");
            $(this).html('<div class="dot" style="background: #019f10;"></div> Show Bookings');
        });

        $(document).on('click', '[data-show-booking]', function () {
            $('.container').removeClass('hide-booking');
            $(this).attr('data-hide-booking',"true");
            $(this).removeAttr('data-show-booking');
            $(this).html('<div class="dot" style="background: #019f10;"></div> Hide Bookings');
        });

        $(document).on('click', '#SlotFormSubmit', function () {
            $('#SlotForm').submit();
        });

        $(document).on('click', '[data-expand-all]', function () {
            $('.collapse').collapse('show');
        });
    },

    loadCalendar:function () {
        var obj = {};
        obj.action = 'get_venue_week';
        obj.the_venue = this.opt.venue;

        PW.ajax(obj, function (response) {
            PW.myCalendar.data = response;
            PW.myCalendar.populateCalendar();
        });
    },

    populateCalendar:function () {
        var _this = this;
        var tr = $('<tr/>', { });
        $(tr).append($('<th/>', {'style':'width: 40px'}));
        for (var a = 0; a < 7; a++) {
            var d = Date.parse($('#date-select').val()).addDays(a);
            var th = $('<th/>', {
                'html':d.toString('ddd d MMM')
            });

            $(tr).append(th);
        }
        $('#calendar-week thead').html(tr);

        $('#calendar-week tbody').html('');
        for (var x = 900; x < 2400; x = x + 100) {
            tr = $('<tr/>', { });
            $(tr).append($('<td/>', {'html':PW.formatTime(x), 'style':'vertical-align: middle;font-weight:900;color:#019f10'}));
            for (var a = 0; a < 7; a++) {
                var d = Date.parse($('#date-select').val()).addDays(a);
                var td = $('<td/>', {
                    'data-date':d.toString('yyyyMMdd'),
                    'data-day':d.toString('dddd'),
                    'data-time':x
                });

                $(tr).append(td);
            }
            $('#calendar-week tbody').append(tr);
        }

        for (var b in this.data.slots) {
            var item = this.data.slots[b];
            var div = $('<div/>', {
                'data-slot':item.id,
                'class':"dropdown",
                'html':'<div data-dropdown="" style="float:right;font-size: 14px;margin-right: 5px;"><i class="icon-reorder"></i></div>' +
                    '<strong>' + item.name + '</strong>' +
                    '<div>' + PW.formatTime(item.start_time) + ' - ' + PW.formatTime(item.end_time) + '</div>' +
                    '<div class="collapse">' +
                    '<hr>' +
                    '<div>ID <strong>' + item.id + '</strong></div>' +
                    '<div>Price <strong>£' + item.price + '</strong></div>' +
                    '<hr>' +
                    '<div class="extras"></div>' +
                    '</div>'
            });

            var menu = $('<ul/>', {
                class:"dropdown-menu"
            });
            div.append(menu);

            menu.append($('<li />', {
                'html':'<a tabindex="-1" target="_blank" href="' + item.pitch + '">View Pitch</a>' +
                    //'<a tabindex="-1" target="_blank" href="' + item.link + '">View Slot</a>' +
                    //'<hr>' +
                    '<a tabindex="-1" data-set-special="' + item.id + '" data-current="' + item.price + '" data-user="1">Set Special Price</a>' +
                    '<a tabindex="-1" data-internal>Book Internally</a>'
            }));

            if (item.active) {
                div.addClass('active');
                menu.append($('<li />', {
                    'html':'<a tabindex="-1" data-deactivate="' + item.id + '">Deactivate Slot</a>'
                }));
            } else {
                menu.append($('<li />', {
                    'html':'<a tabindex="-1" data-activate="' + item.id + '">Activate Slot</a>'
                }));
            }
            menu.append($('<li />', {
                'html':'<hr><a tabindex="-1" data-remove="' + item.id + '" style="color:red;">Remove Slot</a>'
            }));

            var time = Math.floor(item.start_time / 100) * 100;
            for (var c in item.day) {
                $('[data-day=' + item.day[c] + '][data-time=' + time + ']').append(div.clone());
            }
        }

        for (var d in this.data.specials) {
            var item = this.data.specials[d];
            //console.log('[data-date=' + item.date + '] [data-slot=' + item.slot + ']');
            $('[data-date=' + item.date + '] [data-slot=' + item.slot + ']').attr('data-special', item.id);
            $('[data-date=' + item.date + '] [data-slot=' + item.slot + '] .extras').append('<div style="color:red">Special <strong>£' + item.price + '</strong></div><hr>');

            $('[data-date=' + item.date + '] [data-slot=' + item.slot + '] .dropdown-menu').append($('<li />', {
                'html':'<hr><a tabindex="-1" data-remove-special="' + item.id + '" style="color:red;">Remove Special</a>'
            }));
            $('[data-date=' + item.date + '] [data-slot=' + item.slot + '] [data-set-special]').remove();
        }

        for (var d in this.data.bookings) {
            var item = this.data.bookings[d];
            //console.log('[data-date=' + item.date + '] [data-slot=' + item.slot + ']');
            $('[data-date=' + item.date + '] [data-slot=' + item.slot + ']').attr('data-booking', item.id);
            //$('[data-date=' + item.date + '] [data-slot=' + item.slot + '] a').attr('href', item.link);
            if (item.comments != false) {
                $('[data-date=' + item.date + '] [data-slot=' + item.slot + '] .extras').append(
                    '<div>Booking Notes <br><strong>' + item.comments + '</strong></div>'
                );
            }

            $('[data-date=' + item.date + '] [data-slot=' + item.slot + '] .dropdown-menu').append($('<li />', {
                'html':'<hr><a tabindex="-1" data-cancel-booking="' + item.id + '" style="color:red;">Cancel Booking</a>'
            }));

        }
    },

    init:function (options) {
        this.options(options);
        this.events();
        this.loadCalendar();


    }
};